<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
       * {
            margin: 0;
        }
        div#d1 {

            background-color: #518700;
            background-image: url("bookPicture/bang.gif");
            background-repeat: no-repeat;
            background-position: 120px center;
            line-height: 30px;
            width:300px;
            height: 30px;

        }
        div#d2 ul li   {
            font-size: 12px;
            line-height: 28px;


        }
        div#d1{
            color: white;
            text-indent:20px;
            font-size: 16px;


        }
        div#d2 {

            background-image: linear-gradient(#F9FBCB,#F8F8F3);
            width:300px;
            height: 340px;

        }
        div#d2 ul li a {
           text-decoration: none;
            color: #1a66b3;
        }
        div#d2 ul li img {
            vertical-align: middle;
        }

        </style>
</head>
<body>
<div id="d1">
        <h3>畅销书排行</h3>

</div>

<div id="d2">
    <ul type="none">
        <li><img src="bookPicture/book_no01.gif" height="20" width="17"/> <a  href="#"> 不抱怨的世界(畅...</a></li>
        <li><img src="bookPicture/book_no02.gif" height="20" width="17"/> <a href="#"> 遇见未知的自己...</a></li>
        <li><img src="bookPicture/book_no03.gif" height="20" width="17"/><a href=""> 活法（季羡林、...</a></li>
        <li><img src="bookPicture/book_no04.gif" height="18" width="17"/><a href=""> 高效能人士的七个习惯</a> </li>
    </ul>
</div>


</body>
</html>